import React from 'react';
import { message, Button, Tooltip } from 'antd';
import Add from './add';
import RiskList from './list';
import CommonListsIndex from '../../../components/CommonLists/index';
import FilterTool from '../../../components/FilterTool';
import services from '../../../services/api';

class TaskCase extends CommonListsIndex {
  constructor(props) {
    super(props);
    this.api = 'caseCategory';
    this.listsComponent = RiskList;
    this.addComponent = Add;
    this.editComponent = Add;
    this.model_width = 400;
    this.queryTableParams = {
      status: 3
    }; //表格列上的筛选参数
  }
  componentDidMount() {
    this.getAppCodeList();
  }
  // swtichStatus
  handleSwitchStatus = (record) => {
    const param = {
      id: record.id,
      status: record.status === 1 ? 2 : 1,
    };
    services.riskMonitor.switchStatus(param).then((data) => {
      if (data.code === 0) {
        message.success(data.msg);
        this.freshQueryList();
      } else {
        message.error(data.msg);
      }
    });
  };

  getColumns = () => {
    return [
      {
        title: '案件分类',
        key: 'case_category_name',
        dataIndex: 'case_category_name',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '数量',
        key: 'case_number',
        dataIndex: 'case_number',
      },
      {
        title: '创建人',
        key: 'create_user_name',
        dataIndex: 'create_user_name',
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
      {
        title: '创建时间',
        dataIndex: 'create_time',
        key: 'create_time',
        ellipsis: true,
        render: (text) => {
          return (
            <Tooltip title={text} placement='topLeft'>
              <div className='overflowtext'>{text}</div>
            </Tooltip>
          );
        },
      },
    ];
  };

  render() {
    const ListsComponent = this.listsComponent;
    const data = [
      {
        type: 'rangepicker',
        key: 'start',
        name: ['create_time_start', 'create_time_end'],
        placeholder: ['开始时间', '结束时间'],
      },
      {
        type: 'Search',
        key: 'keyword',
        name: 'keyword',
        defaultValue: '',
        placeholder: '请输入案件分类|创建人进行搜索',
      },
    ];
    return (
      <div>
        <div className='flex flex-start'>
          <Button type='primary' onClick={this.add.bind(this, { title: '添加案件分类' })}>
            新增案件分类
          </Button>
          <div className='flex-right-wp'>
            <FilterTool
              ref='filterTool'
              data={data}
              colNum={1}
              query={this.freshQueryList}
              refreshFilter={this.refreshFilter}
              refresh={this.resetList}
              isOnChange={true}
            />
          </div>
        </div>
        <div className='inner-content' style={{ marginTop: '10px' }}>
          <ListsComponent
            {...this.state}
            {...this.props}
            mediator={this}
            edit={this.edit}
            showDetail={this.showDetail}
            onChangePagination={this.onChangePagination}
            queryList={this.freshQueryList}
            columns={this.getColumns()}
            rowKey='case_category_id'
          />
        </div>
      </div>
    );
  }
}

export default TaskCase;
